import React, { useEffect, useState } from 'react'

export default function EffectCom() {
  let [count,setCount]=useState(1)
  let [count2,setCount2]=useState(100)

  useEffect(()=>{
    console.log('执行啦');
  })

  useEffect(()=>{
    console.log('我只在挂载执行');
    //如果要在卸载时执行,返回一个函数
    return ()=>{
      console.log('我在卸载时执行');
    }
  },[])

  //指定值改变时执行,可以传多个
  useEffect(()=>{
    console.log('count改变了');
    return ()=>{
      console.log('count和count2卸载了');
    }
  },[count,count2])

  return (
    <div>
      <div>
      <h2>count: {count}</h2>
      <button onClick={() => setCount(count + 1)}>新增</button>
      <hr />
      <h3>count2: {count2}</h3>
      <button onClick={() => setCount2(count2 - 1)}>递减</button>
    </div>
    </div>
  )
}
